import { Component, EventEmitter, Injector, Input, OnChanges, OnInit, Output, ViewChild } from '@angular/core';
import { STColumnTag, STComponent } from '@delon/abc/st';
import { SFSelectWidgetSchema } from '@delon/form';
import { STComponentBase } from '@shared/itcore/components/st-component-base';
import { FilterGroup, FilterOperate, FilterRule } from '@shared/itcore/itcore.model';
import { ItcoreSTColumn } from '@shared/itcore/services/alain.types';

@Component({
  selector: 'app-itcore-planloglist',
  template: `
    <div>
      <button nz-button (click)="st.reload()"><i nz-icon nzType="reload" theme="outline"></i>刷新</button>
    </div>
    <!-- <st
      #st
      [data]="ReadUrl"
      [columns]="columns"
      size="small"
      [req]="req"
      [res]="res"
      [(pi)]="request.PageCondition.PageIndex"
      [(ps)]="request.PageCondition.PageSize"
      [page]="page"
    ></st> -->
    <st
      #st
      [data]="ReadUrl"
      [columns]="columns"
      [req]="req"
      [res]="res"
      [(pi)]="request.PageCondition.PageIndex"
      [(ps)]="request.PageCondition.PageSize"
      [page]="page"
      size="small"
      [scroll]="{ x: '1750px', y: '1000px' }"
      multiSort
      (change)="change($event)"
      (error)="error($event)"
    >
      <ng-template #LogContent st-row="LogContent" let-item let-index="index" let-column="column">
        <div
          class="itcore-ellipses"
          style="max-width: 120px;"
          nz-popover
          nzPopoverTrigger="hover"
          nzPopoverPlacement="leftTop"
          [nzPopoverContent]="contentTemplate"
        >
          {{ item.LogContent }}
        </div>
        <ng-template #contentTemplate>
          <div style="max-width: 300px;">
            <p>{{ item.LogContent }}</p>
          </div>
        </ng-template>
      </ng-template>
    </st>
  `,
  styles: [],
})
export class ItcorePlanloglistComponent extends STComponentBase implements OnInit {
  @Input() ReadUrl: string;

  @ViewChild('st', { static: false }) st: STComponent;

  constructor(injector: Injector) {
    super(injector);
  }
  LogType: STColumnTag = {
    0: { text: 'Trace', color: 'orange' },
    1: { text: 'Debug', color: 'volcano' },
    2: { text: 'Information', color: 'blue' },
    3: { text: 'Warning', color: 'magenta' },
    4: { text: 'Error', color: 'red' },
    5: { text: 'Critical', color: 'yellow' },
    6: { text: 'None', color: 'green' },
  };

  ngOnInit() {
    super.InitBase();
  }

  protected GetSTColumns(): ItcoreSTColumn[] {
    return [
      { title: '编号', index: 'Id', sort: true, readOnly: true, editable: true, filterable: true },
      { title: '数据Id', index: 'DataId', sort: true, editable: true, filterable: true },
      { title: '日志标题', index: 'Title', sort: true, editable: true, filterable: true },
      {
        title: '日志类型',
        index: 'LogType',
        sort: true,
        editable: true,
        filterable: true,
        type: 'tag',
        tag: this.LogType,
        fenum: [
          { id: 0, text: 'Trace' },
          { id: 1, text: 'Debug' },
          { id: 2, text: 'Information' },
          { id: 3, text: 'Warning' },
          { id: 4, text: 'Error' },
          { id: 5, text: 'Critical' },
          { id: 6, text: 'None' },
        ],
        ui: { widget: 'select' } as SFSelectWidgetSchema,
      },
      { title: '日志内容', index: 'LogContent', sort: true, editable: true, filterable: true, render: 'LogContent' },
      { title: '备注', index: 'Remark', sort: true, editable: true, filterable: true },
      { title: '创建时间', index: 'CreatedTime', sort: true, filterable: false, type: 'date' },
      { title: '创建者Id', index: 'CreatorId', sort: true, filterable: true },
    ];
  }

  reload(filter: FilterGroup) {
    this.st.pi = 1;
    this.request.FilterGroup = filter;
    this.st.req.body = this.request;
    this.st.reload();
  }
}
